<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			div{
				width: 500px;
				height: 500px;
				background-color: #55ffff;
				background-image: url(img/c21ad761c7fa4a8ef4bc627afbf503c6.png);
			    background-size: 30% 30%;
				background-repeat: no-repeat;
				/* 背景定位 */
				background-position: 200 50%;
				background-position: center center;
			}
			body{
				/* 水印：1.加高度 【滚动条】*/
				height: 1000000000px;
				/* 启动背景图模式：等比例缩放模式*/
				background-size: contain;
				/* 2.背景图*/
			    background-image: url(img/c21ad761c7fa4a8ef4bc627afbf503c6.png);
			    /* 4.设置滚动模式*/
				background-attachment:fixed;
			}
		</style>
	</head>
	<body>
		<!-- 背景属性：页面上可以任意调整位置或者改变图片的效果
		 ①background-color背景颜色【子属性可以省略】
		 ②background-image【指定背景图】url()|url("")|url('')
		 ③background-size背景尺寸 属性值 两种 ①px 绝对   %范围值
		                                    ②函数模式 1.contain 等比例缩放图片
											        保证图片完全显示页面中
											         2.cover等比例放大图片
											        覆盖整个容器
		④【前提：背景图小于空间】background-repeat背景重复
		⑤【前提：背景图小于空间】background-position背景定位属性：给背景图定位
		                                          属性值：X% y%
												        数值px 数值px
														英文
		⑥背景固定属性background-attachment【用法：搭配background-size函数】
		做背景图水印效果，步骤1:高度滚动条
		                    2：背景图存入body中
							3：背景图前启动模式 contain
							4.启动背景固定属性 fixed
							
		 -->
		<div></div>
		Lorem ipsum dolor sit, amet consectetur adipisicing elit. Aut, animi! Voluptates velit temporibus necessitatibus nihil quaerat placeat in nulla quo dolor totam nostrum obcaecati debitis, delectus provident maxime iusto impedit?
	</body>
</html>